<template>
    <div>
       <yh-dialog drag title="数据源设置" :visible.sync="visibleTemp" width="500px" @close="closeModal" :close-on-click-modal="false">
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="closeModal">取 消</el-button>
                <el-button size="mini" type="primary" @click="onSubmit">确 定</el-button>
            </div>
       </yh-dialog>
    </div>
</template>

<script lang="ts">
import { Component, Emit, Prop, PropSync, Vue, Watch } from 'vue-property-decorator';
import { exportFactorToSql, getDataSourceByCodes } from '@/pages/quota/api';

@Component({ name: 'RangeIndicatorsDatasource' })
export default class RangeIndicatorsDatasource extends Vue {
    // created() {
    //     getDataSourceByCodes(1, [this.code]).then(res => {
    //         console.log(res);
    //     });
    // }

    @PropSync('visible') syncVisible: boolean;
    @Prop({ default: '' }) code: string;

    private visibleTemp = false;
    private name = {
        dataType: { '3': 'caihui', '7': 'wande', '1': 'juyuan', '2': 'hengsheng' },
        dataColumns: [],
        showdataType: { '3': '财汇', '1': '聚源', '7': '万得', '2': '恒生' },
        relationType: { mustInputs: '0', chooseInputs: '1', mutexMustInputs: '2', mutexChooseInputs: '3' },
        relationType1: { '0': 'mustInputsChoose', '1': 'chooseInputs', '2': 'mutexMustInputs', '3': 'mutexChooseInputs' },
        inputs: ['chooseInputs', 'mustInputs', 'mutexChooseInputs', 'mutexMustInputs'],
    };

    @Watch('visible')
    onWatchVisible(value) {
        if (value !== this.visibleTemp) {
            this.visibleTemp = value;
            getDataSourceByCodes(1, [this.code]).then(res => {
                console.log(res);
            });
        }
    }

    // 关闭弹窗
    closeModal() {
        this.syncVisible = false;
    }

    onSubmit() {
        // const data = {
        //     codes: this.list.map(item => item.key),
        // };
        this.$emit('on-submit');
        this.closeModal();
    }
}
</script>
